<!DOCTYPE html>
<HTML>
<HEAD>
    <TITLE> tree</TITLE>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="${base}/static/res/plugin/ztree/css/style.css" type="text/css">
    <link rel="stylesheet" href="${base}/static/res/manage/css/public.css">
    <link rel="stylesheet" href="${base}/static/res/manage/css/common.css">
    <link rel="stylesheet" href="${base}/static/res/manage/css/ec.css">
    <link rel="stylesheet" href="${base}/static/res/manage/css/list.css">
    <script type="text/javascript" src="${base}/static/res/plugin/jquery/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="${base}/static/res/plugin/validator/jquery.validate.min.js"></script>
    <script type="text/javascript" src="${base}/static/res/plugin/ztree/js/jquery.ztree.core-3.5.min.js"></script>
    <script type="text/javascript" src="${base}/static/res/plugin/ztree/js/jquery.ztree.excheck-3.5.min.js"></script>
    <script type="text/javascript" src="${base}/static/res/plugin/ztree/js/jquery.ztree.exedit-3.5.min.js"></script>
    <script type="text/javascript" src="${base}/static/res/util/utils.js"></script>
    <script type="text/javascript" src="${base}/static/res/admin/js/common.js"></script>
    <SCRIPT type="text/javascript">
        //树形配置
        var setting = {
            async: {
                enable: true,
                url: "getTree.jhtml",
                autoParam: ["com.project.common.web.utils.id"],
                type: "get"
            },
            view: {
                selectedMulti: false
            },
            edit: {
                drag:{
                    isCopy:false,
                    isMove:false
                },
                enable: true,
                showRemoveBtn: true,
                showRenameBtn: false
            },
            callback: {
                onClick: treeClick,
                beforeRemove: beforeRemove,
            }
        };

        //节点点击事件--编辑
        function treeClick(event, treeId, treeNode, chkFlag) {
            if (treeNode != null && com.project.common.web.utils.id != null) {
                $("#editTree").attr("src","edit.jhtml?id="+com.project.common.web.utils.id);
            }
        }

        //移除节点前
        function beforeRemove(treeId, treeNode) {
            var zTree = $.fn.zTree.getZTreeObj("treeDemo");
            zTree.selectNode(treeNode);
            if (confirm("确认删除 节点【" + treeNode.name + " 】吗？")) {
                $.getJSON("delete.jhtml", {id: com.project.common.web.utils.id}, function (data) {
                    $.message(data.type, data.msg);
                    if (data && data.success) {
                        $.fn.zTree.getZTreeObj("treeDemo").removeNode(treeNode);
                    }
                });
            }
            return false;
        }

        //加载树形
        $(document).ready(function () {

            //新增节点
            $("#addNode").click(function(){
                $("#editTree").attr("src","add.jhtml");
            })

            //初始化树形结构
            $.fn.zTree.init($("#treeDemo"), setting);

            //树形DIV样式
            $("div.tree").height($(window).height()-100);

            //当前窗口变化样式
            window.onresize = function(){
                $("div.tree").height($(window).height()-100);
            };

        });

    </SCRIPT>
</HEAD>

<BODY>
<div class="set setlt">
    <h3><#--<a href="javascript:;">首页</a>--><a href="javascript:;">系统管理</a><a href="javascript:;">> 区域管理</a></h3>
    <div class="txte">
        <p class="setp"><input type="button" value="+ 新增区域" id="addNode" class="red"></p>
    </div>

    <div class="tree treetwo">
        <div class="wrapper content_wrap">
            <ul id="treeDemo" class="ztree"></ul>
        </div>
    </div>

    <iframe width="80%" height="400px"  frameborder="0" scrolling="no" src="/admin/area/add.jhtml" id="editTree" name="editTree" style="float:right"></iframe>
</div>
</BODY>
</HTML>